<template xmlns="http://www.w3.org/1999/html">
  <sea-data-table ref="tableObject" url="/kettle/task/log/page">
    <!--表头-->
    <sea-table-header slot="header">
      <!--标题栏-->
      <sea-table-title slot="title" title="脚本运行日志"
                      subtitle="一个批次包含n个任务，1个任务对应于1个脚本。"></sea-table-title>

    </sea-table-header>

    <!-- 弹窗、抽屉 -->
    <panel slot="drawer" ref="panel"></panel>

    <!--表头-->
    <template slot="columns">
      <el-table-column property="batchId" label="任务批次" width="160"></el-table-column>
      <el-table-column property="taskId" label="任务ID" width="260"></el-table-column>
      <sea-col-link type="def" property="jobId" label="Kettle任务ID" width="100" :click="onAction"></sea-col-link>
      <el-table-column property="gmtStart" label="开始时间" width="180" show-overflow-tooltip></el-table-column>
      <el-table-column property="gmtEnd" label="结束时间" width="180"></el-table-column>
      <el-table-column property="executeStatus" label="执行结果" width="180"></el-table-column>
      <el-table-column property="message" label="错误"></el-table-column>
    </template>
  </sea-data-table>
</template>

<script>
import Panel from "../../log";

export default {
    components: {
        Panel
    },
    props: {
        // 脚本ID
        scriptId: {type: String, default: undefined},
    },
    watch: {
        scriptId: {
            handler: function (val) {
                this.reload(val);
            }
        }
    },
    methods: {
        /**
         * 重新加载数据
         *
         * @param id 查询参数
         */
        reload: function (id) {
            this.$refs.tableObject.reload({scriptId: id});
        },
        /**
         * 操作栏事件分发
         * @param evt 事件
         * @param row 行级对象
         * @param old 可供回滚的参数
         */
        onAction: function (evt, row, old) {
            this.$refs.panel.onAction(evt, {idJob: row.jobId}, old);
        }
    }
}
</script>
